<!--
 * @Description: 下载报告
 * @Author: qingyang
 * @Date: 2023-07-21 16:52:23
 * @LastEditors: qingyang
 * @LastEditTime: 2023-07-21 18:10:39
-->
<template>
  <CDialog
    title="下载"
    v-model:visible="dialogVisible"
    @confirm="handleConfirm"
    @cancel="dialogVisible = false"
    confirmText="下载报告"
  >
    <el-form
      class="down-wrap"
      ref="formRef"
      :model="taskForm"
      :rules="obj.rules"
      label-position="top"
    >
      <el-form-item label="选择标准" prop="standard">
        <CStandardRadioGroup v-model="taskForm.standard">
          <CStandardRadio
            class="standard"
            v-for="item in standardList"
            :label="item.scopeName"
            :desc="item.desc"
            :value="item.scope"
            :key="item.scope"
            :disabled="item.disabled"
          ></CStandardRadio>
        </CStandardRadioGroup>
      </el-form-item>
    </el-form>
  </CDialog>
</template>
<script lang="ts">
export default {
  name: 'DownloadDialog'
};
</script>
<script lang="ts" setup>
import { defineProps, withDefaults, defineEmits, computed, ref, watch, reactive } from 'vue';
import { CDialog } from '@/components/CDialog/index';
import * as obj from './rules';
import { CStandardRadio, CStandardRadioGroup } from '@/components/CStandardRadio/index';
import {
  CarbonInventoryStandardsEnum,
  CarbonInventoryStandardsMap,
  CarbonInventoryStandardsDescMap
} from '@/constants/enum';

interface SelectFillTypeDialogProps {
  visible: boolean;
  confirmFn: (standard: keyof typeof CarbonInventoryStandardsEnum) => Promise<boolean>;
  /**
   * 禁用的标准
   */
  disableStandards?: string[];
}
const props = withDefaults(defineProps<SelectFillTypeDialogProps>(), {
  disableStandards: () => []
});
const emit = defineEmits(['update:visible']);
const constantStandardList = [
  {
    scope: 'ISO',
    scopeName: CarbonInventoryStandardsMap.ISO,
    desc: CarbonInventoryStandardsDescMap.ISO
  },
  {
    scope: 'GB',
    scopeName: CarbonInventoryStandardsMap.GB,
    desc: CarbonInventoryStandardsDescMap.GB
  },
  {
    scope: 'GHG',
    scopeName: CarbonInventoryStandardsMap.GHG,
    desc: CarbonInventoryStandardsDescMap.GHG
  }
];

const standardList = computed(() => {
  return constantStandardList.map(item => {
    return {
      ...item,
      disabled: props.disableStandards?.includes(item.scope) || false
    };
  });
});
const dialogVisible = computed<boolean>({
  get: () => {
    return props.visible;
  },
  set: val => {
    emit('update:visible', val);
  }
});
watch(
  () => dialogVisible.value,
  visible => {
    if (visible) {
      init();
    } else {
      formRef.value?.resetFields();
    }
  }
);

const formRef = ref();
const taskForm = reactive({
  type: '',
  standard: '' as keyof typeof CarbonInventoryStandardsEnum
});
function handleConfirm() {
  formRef.value?.validate((valid: boolean) => {
    if (valid && props.confirmFn) {
      const result = props.confirmFn(taskForm.standard);
      if (
        (typeof result === 'object' || typeof result === 'function') &&
        typeof result.then === 'function'
      ) {
        result.then(() => {
          dialogVisible.value = false;
        });
      } else {
        console.warn('confirmFn返回值必须为Promise');
      }
    }
  });
}
function init() {
  formRef.value?.resetFields();
}
</script>

<style lang="scss" scoped>
.down-wrap {
  width: 632px;
  .standard {
    width: 204px;
  }
}
</style>
